<html>
<body>

<li>Tables have width 500px.
<li>Yellow cells have width 200px.
<li>Green cells are auto-width.
<li>Blue cells have colspan = 2 and, in test case, have various specified widths.

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 10px; background: lightblue" colspan="2">10 px</td>
  </tr>
</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 50px; background: lightblue" colspan="2">50 px</td>
  </tr>
</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 100px; background: lightblue" colspan="2">100 px</td>
  </tr>
</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 384px; background: lightblue" colspan="2">384 px</td>
  </tr>
</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 385px; background: lightblue" colspan="2">385 px</td>
  </tr>
</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 390px; background: lightblue" colspan="2">390 px</td>
  </tr>
</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 500px; background: lightblue" colspan="2">500 px</td>
  </tr>
</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 600px; background: lightblue" colspan="2">600 px</td>
  </tr>
</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 900px; background: lightblue" colspan="2">900 px</td>
  </tr>
</table>
<br/>

</table>
<br/>

<table width="500px" cellspacing="0" cellpadding="0">
  <tr>
    <td style="width: 200px; background: yellow"></td>
    <td style="background: lightgreen">Here are some words.</td>
  </tr>
  <tr>
    <td style="width: 1500px; background: lightblue" colspan="2">1500 px</td>
  </tr>
</table>
<br/>

</body>
</html>
